<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>OPPO商品列表</title>
		<link rel="stylesheet" type="text/css" href="./css/style.css"/>
	</head>
	<body>
		<!--顶部区域开始-->
		<div class="top">
			<div class="top_box">
				<div class="top_box_left">
				<ul>
					<li><a href="">社区</a></li><div></div>
					<li><a href="">ColorOS</a></li><div></div>
					<li><a href="">云服务</a></li><div></div>
					<li><a href="">手机助手</a></li>
				</ul>
				</div>
				<div class="top_box_right">
					<ul>
						<li><a href="">123</a></li><div></div>
						<li><a href="./login.html">登录</a></li><div></div>
						<li><a href="./register.html">注册</a></li>
					</ul>
				</div>
			</div>
		</div>
		<!--顶部区域结束-->
		<!--logo-导航区域开始-->
		<div class="logo-nav">
			<div class="logo">
				<img href="./index.html" src="./images/logo.png"/>
			</div>
			<div class="cart">
				<span>购物车</span>
			</div>
			<div class="nav">
				<ul>
					<li><a href="./index.html">首页</a></li>
					<li><a href="./list.html">手机</a></li>
					<li><a href="./list.html">配件</a></li>
					<li><a href="">购物指南</a></li>
				</ul>
			</div>	
		</div>
		<!--logo-导航区域结束-->
		<div class="line-1"></div>
		<div class="line-2"></div>
		<div class="line-3"></div>	
		<div class="line-4"></div>	
		<div class="line-5"></div>
		<div class="line-6"></div>
		<!--子导航开始-->
		<div class="subnav">
			<a href="">首页</a>&nbsp<i>/</i>&nbsp
			<span>手机列表</span>
		</div>
		<!--子导航结束-->
		<!--分类开始部份-->
		<div class="sort">
			<div class="sort_top">
				<div class="sort_top_sort">
					<img src="images/list.1.jpg"/>
					<p style="display: block;"></p>
				</div>
				<div class="sort_top_sort">
					<img src="images/list.2.jpg"/>
					<p></p>
				</div>
				<div class="sort_top_sort">
					<img src="images/list.3.jpg"/>
					<p></p>
				</div>
				<div class="sort_top_sort">
					<img src="images/list.4.jpg"/>
					<p></p>
				</div>
				<div class="sort_top_sort">
					<img src="images/list.5.jpg"/>
					<p></p>
				</div>
				<div class="sort_top_sort">
					<img src="images/list.6.jpg"/>
				</div>
			</div>
			<div class="sort_bottom">
				<div class="sort_bottom_top">
					<li>网络:</li>
					<li>价格:</li>
					<li>屏幕尺寸:</li>
				</div>
				<div class="sort_bottom_bottom">
					<ul class="t">
						<a class="shou" href="">全部</a><p></p>
						<li><a href="">移动4G</a></li><p></p>
						<li><a href="">联通4G</a></li><p></p>
						<li><a href="">联通3G</a></li><p></p>
						<li><a href="">移动联通双4G</a></li><p></p>
						<li><a href="">电信4G</a></li>
					</ul>
					<ul class="c">
						<a class="shou" href="">全部</a><p></p>
						<li><a href="">￥0~￥999</a></li><p></p>
						<li><a href="">￥1000~￥1999</a></li><p></p>
						<li><a href="">￥2000~￥2999</a></li><p></p>
						<li><a href="">￥3000以上</a></li><p></p>
					</ul>
					<br />
					<ul class="b">
						<a class="shou" href="">全部</a><p></p>
						<li><a href="">4.0~4.5</a></li><p></p>
						<li><a href="">4.6~4.9</a></li><p></p>
						<li><a href="">5.00~5.9</a></li><p></p>
					</ul>	
				</div>
			</div>
		</div>
		<!--分类部份结束-->
		<!--商品列表开始-->
		<div class="list_content">
			<div class="list_content_top">
				<div class="list_title">
					<a style="color: #2AAD6F;" href="">默认</a>
					<a href="">价格</a>
					<a href="">最新</a>
				</div>
				<div class="list_box">
					<div class="list_con">
						<a href="./products.html"><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="products.html">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href="./products.html"><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="products.html">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href="./products.html"><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="products.html">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="list_con">
						<a href=""><img class="" src="images/list.con.jpg"/></a>
						<div class="note">
							<a href="">R7 全金属闪拍移动4G手机银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
				</div>
			</div>
			<!--分页开始-->
			<div class="page">
				<a style="" href=""><<</a>
				<a style="" href="">1</a>
				<a href="">2</a>
				<a href="">3</a>
				<a style="" href="">>></a>
			</div>
			<!--分页结束-->
			<!--最近浏览开始-->
			<div class="recent">
				<h2>您最近浏览过的产品</h2>
				<div class="rectent_box">
					<div class="rectent_box_con">
						<img src="images/rectent1.jpg" alt="" />
						<div class="rectent_box_content">
							<a href="">R7 全金属闪拍移动4G手机 银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="rectent_box_con">
						<img src="images/rectent1.jpg" alt="" />
						<div class="rectent_box_content">
							<a href="">R7 全金属闪拍移动4G手机 银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="rectent_box_con">
						<img src="images/rectent1.jpg" alt="" />
						<div class="rectent_box_content">
							<a href="">R7 全金属闪拍移动4G手机 银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
					<div class="rectent_box_con">
						<img src="images/rectent1.jpg" alt="" />
						<div class="rectent_box_content">
							<a href="">R7 全金属闪拍移动4G手机 银色</a>
							<span>￥2499.00</span>
						</div>
					</div>
				</div>
				
			</div>
			<!--最近浏览结束-->
		</div>
		<!--商品列表结束-->
		<!--底部1开始-->
		<div class="bottom1">
			<div>
				<img src="./images/bottom1.jpg"/>
				<img src="./images/bottom2.jpg"/>
			</div>
		</div>
		<!--底部1结束-->
		<!--底部2开始-->
		<div class="bottom2">
			<div class="left">
				<img src="./images/13.png"/>
				<a href="">OPPO社区</a>
			</div>
			<div class="center">
				<img src="./images/14.png"/>
				<a href="">ColorOS</a>
			</div>
			<div class="right">
				<img src="./images/15.png"/>
				<a href="">软件商店</a>
			</div>
		</div>
		<!--底部2结束-->
		<!--底部3开始-->
		<div class="bottom3">
			<dl>
				<dt><a href="">推荐机型</a></dt>
				<dd><a href="">N3</a></dd>
				<dd><a href="">R5</a></dd>
				<dd><a href="">Find7</a></dd>
				<dd><a href="">R1C</a></dd>
				<dd><a href="">N1 mini</a></dd>
			</dl>
			<dl>
				<dt><a href="">在线购买</a></dt>
				<dd><a href="">手机</a></dd>
				<dd><a href="">移动电源</a></dd>
				<dd><a href="">手机保护套</a></dd>
				<dd><a href="">贴膜</a></dd>
				<dd><a href="">耳机</a></dd>
			</dl>
			<dl>
				<dt><a href="">服务</a></dt>
				<dd><a href="">购买帮助</a></dd>
				<dd><a href="">物流查询</a></dd>
				<dd><a href="">常见问题</a></dd>
				<dd><a href="">服务政策</a></dd>
				<dd><a href="">服务网店查询</a></dd>
			</dl>
			<dl>
				<dt><a href="">会员登录</a></dt>
				<dd><a href="">会员注册</a></dd>
				<dd><a href="">积分兑换</a></dd>
			</dl>
			<dl>
				<dt><a href="">OPPO品牌</a></dt>
				<dd><a href="">关于OPPO</a></dd>
				<dd><a href="">OPPO历史</a></dd>
				<dd><a href="">OPPO风采</a></dd>
				<dd><a href="">官方新闻</a></dd>
				<dd><a href="">OPPO视频</a></dd>
			</dl>
		</div>
		<!--底部3结束-->
		<!--底部4开始-->
		<div class="bottom4">
			<div class="bottom4_box">
				<div class="bottom4_box_left">
					<span class="guanzhu">关注我们</span>
					<img class="weibo" src="images/di1.png" alt="" />
					<img class="weix" src="images/di2.png" alt="" />
					<span class="jiaru">加入我们</span>
					<img class="jia" src="images/di3.png" alt="" />
				</div>
				<div class="bottom4_box_right">
					<img src="images/di4.png" alt="" />
					<div class="bottom4_box_right_content1">
						<a class="kefu" href="">在线客服</a><br />
						<a class="shijian" href="">服务时段：8:30~10:00</a>
					</div>
					<img class="del" src="images/di5.png" alt="" />
					<div class="bottom4_box_right_content2">
						<a class="kefu" href="">在线客服</a><br />
						<a class="shijian" href="">服务时段：8:30~10:00</a>
					</div>
				</div>
			</div>
		</div>
		<!--底部4结束-->
		<!--底部5开始-->
		<div class="bottom5">
			<span>© 2005 - 2015 广东欧珀移动通信有限公司 版权所有 粤 ICP 备 08130115 号</span>
		</div>
		<!--底部5结束-->
	</body>
</html>
